Google maps jQuery plugin load markers with JSON example

Using jquery with Google maps

Download jQuery 1.4.X or higher and optionally jQuery UI 1.8.X or higher or use Googles or Microsofts CDN.

	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js""></script>
	<script type="text/javascript" src="PATH_TO_PLUGIN/jquery.ui.map.js"></script>

or

	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
	<script type="text/javascript" src="PATH_TO_PLUGIN/jquery.fn.map.js"></script>
<script type="text/javascript">
	$(function() {
		$('#map_canvas').gmap().bind('init', function() { 
			$.getJSON( 'http://jquery-ui-map.googlecode.com/svn/trunk/demos/json.json', function(data) { 
				$.each( data.markers, function(i, m) {
					$('#map_canvas').gmap('addMarker', { 'position': new google.maps.LatLng(m.lat, m.lng), 'bounds': true } );
				});
			});
		});
	});
</script>

More Google maps and jQuery examples